<template>
  <div class="app-container">
    <div class="operation">
      <div class="search">
        <el-form :inline="true" class="demo-form-inline">
          <el-form-item label="工单编号">
            <el-input placeholder="审批人" />
          </el-form-item>
          <el-form-item label="工单状态">
            <el-select placeholder="活动区域">
              <el-option label="代办" value="shanghai" />
              <el-option label="进行" value="beijing" />
              <el-option label="取消" value="beijing" />
              <el-option label="完成" value="beijing" />
            </el-select>
          </el-form-item>
          <el-form-item>
            <el-button type="primary" icon="el-icon-search">查询</el-button>
          </el-form-item>
        </el-form>
      </div>
      <div class="result">
        <div class="role-operate">
          <el-button size="mini" icon="el-icon-circle-plus-outline" type="warning">添加角色</el-button>
        </div>
        <el-table>
          <el-table-column label="序号">1</el-table-column>
          <el-table-column label="工单编号">1</el-table-column>
          <el-table-column label="设备编号">1</el-table-column>
          <el-table-column label="工单类型">1</el-table-column>
          <el-table-column label="工单方式">1</el-table-column>
          <el-table-column label="工单状态">1</el-table-column>
          <el-table-column label="运维人员">1</el-table-column>
          <el-table-column label="创建日期">1</el-table-column>
          <el-table-column label="操作">
            <el-button type="text">查看详情</el-button>
          </el-table-column>
        </el-table>
        <!-- 分页 -->
        <el-row type="flex" style="height:60px" justify="end" align="middle">
          <el-button>上一页</el-button>
          <el-button>下一页</el-button>
        </el-row>
      </div>
    </div>
  </div>

</template>

<script>
import { getTaskType } from '@/api/operation'
export default {
  data() {
    return {
      list: []
    }
  },
  methods: {
    async getList() {
      const res = await getTaskType
      console.log(res)
    }
  }
}
</script>

<style lang='scss' scoped>
.app-container{
  background-color: #f8fafd;
  // height: 100%;
}
.operation {
  // height: 100%;
  .search {
    // margin: 10px;
    background-color: #fff;
    // width: 100%;
    height: 54px;
   .el-form-item{
    //  line-height: 64px;
    margin:  5px;
   }
    margin-bottom: 20px;
  }
  .result{
    background-color: #fff;
  }
}
</style>
